<template>
	<view v-if="state.isshow">
		<web-view :src="url"></web-view>
	</view>
	<view v-else>
		<view class="loading-cover"></view>
		<view class="load">
			<image class="loading"
				:src="sheep.$url.static('/assets/addons/shopro/uniapp/chat/loading.png')" mode="aspectFill"></image>
				<view style="margin-top:5px;">加载中……</view>
		</view>
	</view>
	
	
</template>

<script setup>
	import {
		onLoad,
		onBackPress
	} from '@dcloudio/uni-app';
	import {
		ref,
		reactive
	} from 'vue';
	import sheep from '@/sheep';

	const state = reactive({
		isshow: false
	});

	const loadingMap = {
		loadmore: {
			title: '查看更多',
			icon: 'el-icon-d-arrow-left',
		},
	};
	const url = ref('');
	onLoad((options) => {
		console.log(options)
		sheep.$api.course.getDocumentById({
			'id': options.id,
			'type': options.type
		}).then((res) => {
			console.log(res.data);
			if (res.code === 1) {
				uni.setNavigationBarTitle({
					title: res.data.lesson_name
				});
				url.value = "https://wkadmin.jhpress.com/addons/jzcosoffice/index/preview?file=" + res.data
					.download_url;
				state.isshow = true;
			}
		});
	});

	onBackPress((options) => {
		uni.navigateBack({
		      delta: 1 // 返回上一级页面
		    });
		return false; // 阻止默认的返回行为
	})
</script>

<style lang="scss" scoped>
	.loading-cover {
		position: absolute;
		left: 0;
		top: 0;
		right: 0;
		bottom: 0;
		background-color: rgba(0, 0, 0, .2);
		/* #ifndef APP-NVUE */
		display: flex;
		/* #endif */
		flex-direction: column;
		align-items: center;
		z-index: 1001;
	}
	
	.load{
		position: fixed;
		    top: 50%;
		    left: 50%;
		    margin-left: -25px;
		    margin-top: -24px;
			z-index: 9999;
	}
	.loading {
		width: 100rpx;
		height: 100rpx;
		-webkit-animation: rotating 2s linear infinite;
		animation: rotating 2s linear infinite;

		@-webkit-keyframes rotating {
			0% {
				transform: rotateZ(0);
			}

			100% {
				transform: rotateZ(360deg);
			}
		}

		@keyframes rotating {
			0% {
				transform: rotateZ(0);
			}

			100% {
				transform: rotateZ(360deg);
			}
		}
	}
</style>